<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/login.css">
    <script src="./js/jquery-1.12.4.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.min.js"></script>
    <script src="./js/login.js"></script>
    <!-- 顶部搜索 -->
    <script src="./js/topSearch.js"></script>
</head>

<body>
    <!-- 顶部 -->
    <div class="header">
        <img class="logo-l" src="./imgs/logo.png">
        <div class="topnav">
            <ul>
                <li><a href="index.html">首页</a></li>
                <li><a href="allCompete.html">竞赛汇总</a></li>
                <li><a href="joinTeam.html">组队</a></li>
                <li><a href="community.html">社区</a></li>
                <li><a href="jobs.html">实习求职</a></li>
                <li><a href="">优秀作品</a></li>
                <li><a href="">关于我们</a></li>
            </ul>
        </div>
        <!-- 搜索 -->
        <div class="search-box">
            <input id="top_search" type="search" placeholder="搜比赛或用户">
        </div>
        <!-- 头像 -->
        <div class="logoinbox" id="loginbox">
            <img class="logo" src="./imgs/logo.png">
            <span><a href="./login.html">登录</a></span>
        </div>
    </div>

    <!-- 登录主体 -->
    <div class="logof">
        <div class="container logowrap">
            <div class="l-head">
                <p>Shall We 欢迎你的到来</p>
            </div>
            <div class="l-body">
                <!-- 登录表单部分 -->
                <div class="pwd_login_wrap">
                    <div class="input_wrap">
                        <div class="border_wrap">
                            <i class="icon_user"></i>
                            <input class="account" type="text" placeholder="请输入你的登录名/手机号/邮箱 " id="login-input-account" value="test">
                        </div>
                        <p></p>
                    </div>
                    <div class="input_wrap">
                        <div class="border_wrap">
                            <i class="icon_pwd"></i>
                            <input class="pwd" type="password" minlength="6" maxlength="16" placeholder="请输入你密码" id="login-input-pwd" value="test">
                            <img class="pwd_type" src="./imgs/icon-hide.png">
                        </div>
                        <p></p>
                    </div>
                    <div class="register_find_pwd clearfix">
                        <div>
                            <input class="icon_pwd_remember" type="checkbox" name="check_pwd1" id="check_pwd1" value="check" checked="checked">
                            <label for="check_pwd1"><span style=" position:relative;top: -3px;">记住密码</span></label>
                        </div>

                        <a class="find_passwd" href="#">忘记密码？</a>
                    </div>
                    <button class="login_btn" id="login_submit_btn" style="width: 100%;cursor: pointer;">登录</button>
                </div>
                <!-- 扫码 -->
                <div class="wrap-erwei">
                    <div class="topjs">
                        <p>竞赛 社交</p>
                        <p>组队 求职</p>
                    </div>
                    <img src="./imgs/erwei.png" alt="">
                    <p>微信扫一扫，订阅公众号</p>
                </div>
            </div>
        </div>
    </div>

    <script>
        $(function () {
            // 密码输入显示/隐藏
            $('.pwd_type').click(function (event) {
                var pwd_type = $(this).siblings('.pwd').prop('type');
                if (pwd_type == 'password') {
                    $(this).siblings('.pwd').prop('type', 'text');
                    $(this).prop('src', './imgs/pwd-show.png')
                } else {
                    $(this).siblings('.pwd').prop('type', 'password');
                    $(this).prop('src', './imgs/icon-hide.png')
                }
            });
        })
    </script>
</body>

</html>